<!-- html -->
<template>
  <h2 class="h2">基本生命周期</h2>
  <span class="span3">父组件</span>
  <hr class="hr1">
  <span class="span3">子组件</span>
  <br>
  <lifecycleTest1Child v-if="isShow" />
</template>

<!-- js或ts -->
<script lang="ts">
export default {
  name: 'lifecycleTest1'
}
</script>

<!-- js或ts -->
<script setup lang="ts">
import { ref, onBeforeMount, onMounted } from 'vue'
import lifecycleTest1Child from '@/components/lifecycle/LifecycleTest1Child.vue'

//数据
let isShow = ref(true)
//方法
//setup默认创建
console.log('父组件创建')
//挂载前
onBeforeMount(() => {
  console.log('父组件挂载前')
})
//挂载后
onMounted(() => {
  console.log('父组件挂载后')
})
</script>

<!-- 样式 -->
<style scoped></style>